<template>
  <div class="app-container">
    <el-card class="content-edit">
      <div slot="header">添加核销员</div>
      <el-form ref="form" :model="form" :rules="rules" label-width="140px">
        <el-form-item label="姓名" prop="nickname">
          <el-input v-model="form['nickname']"/>
        </el-form-item>
        <el-form-item label="性别">
          <el-radio-group v-model="form['gender']">
            <el-radio :label="1">男</el-radio>
            <el-radio :label="2">女</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="身份证号">
          <el-input v-model="form['idCard']"/>
        </el-form-item>
        <el-form-item label="手机号" prop="mobile">
          <el-input v-model="form['mobile']"/>
        </el-form-item>
        <el-form-item label="邮箱">
          <el-input v-model="form['email']"/>
        </el-form-item>
        <el-form-item label="联系地址">
          <el-input v-model="form['address']"/>
        </el-form-item>
        <el-form-item label="备注信息">
          <el-input v-model="form['remark']" type="textarea" rows="3"/>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">保存</el-button>
          <el-button @click="$router.back()">取消</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
  import WsUploadMultipleImg from 'vue-element-simple/components/UploadMultipleImg/index';
  export default {
    name: 'CustomerServiceTelephone',
    components: {WsUploadMultipleImg},
    data() {
      return {
        form: {
          // 要绑定的用户id
          userId: null,
          // 名称
          nickname: '',
          // 性别
          gender: 1,
          // 手机号码
          mobile: '',
          // 邮箱
          email: '',
          // 身份证号
          idCard: '',
          // 联系地址
          address: '',
          // 备注
          remark: ''
        },
        rules: {
          nickname: [{required: true, message: '姓名不为空', trigger: 'change'}],
          mobile: [{required: true, message: '手机号码不为空', trigger: 'change'}]
        }
      }
    },
    mounted(){
      this.form['userId'] = this.$router.currentRoute.query['userId'] || null;
    },
    methods: {
      // 提交
      onSubmit() {
        this.$refs.form.validate(valid => {
          if (valid) {
            this.loading = true;
            (async () => {
              const params = Object.assign({}, this.form);
              const result = await this.$service.applicationAddVerifier(params);
              this.loading = false;
              if (result.code === 0) {
                this.$message.success('操作成功~');
                this.$router.back();
              } else {
                this.$message.error(result.msg);
              }
            })();
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      }
    }
  }
</script>
